<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">玩转乐园</el-breadcrumb-item>
      <el-breadcrumb-item>开放时间</el-breadcrumb-item>
    </el-breadcrumb>

    <el-tabs type="border-card" style="margin-top: 15px">
      <el-tab-pane label="本月运营时间">
        <el-calendar v-model="value"> </el-calendar>
        <el-tag
          type="primary"
          style="
            font-size: 16px;
            height: 48px;
            line-height: 48px;
            margin-left: 20px;
          "
        >
          为确保安全，园区可能遇恶劣天气、特殊活动、游客过多、设备故障检修等原因调整部分设备和表演时间或闭园，以园区当天实际公告为准。具体情况可拨打电话：02788518861咨询。
        </el-tag>
      </el-tab-pane>
      <el-tab-pane label="游乐项目运行时间">
        <el-tag type="primary" style="margin-left: 0px">
          为了广大游客的游玩安全，园区会定期对各设备项目进行日检、周检、月检，部分设备项目会因检修全天暂停开放，可参考下表设备检修时间，实际情况以园区当天公告为准，或拨打电话02788518861进行咨询。
        </el-tag>
        <el-table
          :data="tableData_2"
          :span-method="objectSpanMethod_2"
          :header-cell-style="{ textAlign: 'center', fontSize: '16px' }"
          :cell-style="{ textAlign: 'center' }"
          style="width: 100%; margin-top: 20px"
        >
          <el-table-column label="游乐设施运营时间表">
            <el-table-column
              prop="num"
              label="序号"
              width="120"
            ></el-table-column>
            <el-table-column prop="area" label="区域"></el-table-column>
            <el-table-column prop="name" label="游乐设施名称">
            </el-table-column>
            <el-table-column prop="time" label="运营时间"></el-table-column>
            <el-table-column prop="remarks" label="备注"></el-table-column>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="剧场类项目运行时间">
        <el-table
          :data="tableData_3"
          :span-method="objectSpanMethod_3"
          :header-cell-style="{ textAlign: 'center', fontSize: '16px' }"
          :cell-style="{ textAlign: 'center' }"
          style="width: 100%; margin-top: 20px"
        >
          <el-table-column label="剧场类项目运行时间表">
            <el-table-column
              prop="num"
              label="序号"
              width="120"
            ></el-table-column>
            <el-table-column prop="area" label="区域"></el-table-column>
            <el-table-column prop="name" label="游乐设施名称">
            </el-table-column>
            <el-table-column prop="time" label="运营时间"></el-table-column>
          </el-table-column>
        </el-table>
        <el-tag type="primary" style="margin-left: 0px; margin-top: 20px">
          备注：具体开放情况，以现场公示为准。
        </el-tag>
      </el-tab-pane>
      <el-tab-pane label="表演时间">
        <el-table
          :data="tableData_4"
          :header-cell-style="{ textAlign: 'center', fontSize: '16px' }"
          :cell-style="{ textAlign: 'center' }"
          style="width: 100%; margin-top: 20px"
        >
          <el-table-column label="武汉多罗碧加乐园表演时间表">
            <el-table-column
              prop="num"
              label="序号"
              width="120"
            ></el-table-column>
            <el-table-column prop="program" label="内容"></el-table-column>
            <el-table-column prop="time" label="时间"> </el-table-column>
            <el-table-column prop="place" label="表演地点"></el-table-column>
            <el-table-column prop="remarks" label="备注"></el-table-column>
          </el-table-column>
        </el-table>
        <el-tag
          type="primary"
          style="margin-left: 0px; margin-top: 20px; height: 96px"
        >
          温馨提示：<br />
          1、以上表演时间及节庆活动的演出以当日公告为准；<br />
          2、若因天气原因（遇雷、雨、雷电和台风）等，表演场地不符合演出条件的，该演出暂停。
        </el-tag>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      value: new Date(),
      // 游乐类项目表格原始数据
      tableData_2: [
        {
          num: 1,
          area: "欢乐海洋",
          name: "水上飞机",
          time: "9:30 - 17:30",
          remarks: "每周一周检 -- 每月11号月检",
        },
        {
          num: 2,
          area: "欢乐海洋",
          name: "海马骑士",
          time: "10:00 - 17:30",
          remarks: "每周三周检 -- 每月13号月检",
        },
        {
          num: 3,
          area: "欢乐海洋",
          name: "音乐飞船",
          time: "10:00 - 17:30",
          remarks: "每周三周检 -- 每月20号月检",
        },
        {
          num: 4,
          area: "欢乐海洋",
          name: "奇趣飞鱼",
          time: "9:30 - 17:30",
          remarks: "每周四周检 -- 每月28号月检",
        },
        {
          num: 5,
          area: "欢乐海洋",
          name: "冲浪勇士",
          time: "10:30 - 18:00",
          remarks: "每周一周检 -- 每月11号月检",
        },
        {
          num: 6,
          area: "甜品王国",
          name: "神圣时刻",
          time: "9:30 - 17:30",
          remarks: "每周一周检 -- 每月25号月检",
        },
        {
          num: 7,
          area: "甜品王国",
          name: "疯狂溜达车",
          time: "10:30 - 17:30",
          remarks: "每周四周检 -- 每月2号月检",
        },
        {
          num: 8,
          area: "甜品王国",
          name: "甜蜜钟楼",
          time: "10:00 - 17:30",
          remarks: "每周三周检 -- 每月20号月检",
        },
        {
          num: 9,
          area: "甜品王国",
          name: "棉花糖跳跳",
          time: "9:30 - 17:30",
          remarks: "每周四周检 -- 每月14号月检",
        },
        {
          num: 10,
          area: "甜品王国",
          name: "疯狂下午茶",
          time: "9:30 - 17:30",
          remarks: "每周四周检 -- 每月21号月检",
        },
        {
          num: 11,
          area: "甜品王国",
          name: "蛋糕皇宫",
          time: "10:30 - 17:30",
          remarks: "每周五周检 -- 每月29号月检",
        },
        {
          num: 12,
          area: "甜品王国",
          name: "梦幻棒棒糖",
          time: "10:00 - 18:00",
          remarks: "每周二周检 -- 每月12号月检",
        },
        {
          num: 13,
          area: "甜品王国",
          name: "奶酪泡泡馆",
          time: "9:30 - 18:00",
          remarks: "每周一周检 -- 每月25号月检",
        },
        {
          num: 14,
          area: "甜品王国",
          name: "颠三倒四机",
          time: "10:30 - 17:00",
          remarks: "每周二周检 -- 每月26号月检",
        },
        {
          num: 15,
          area: "甜品王国",
          name: "靴子警局",
          time: "9:30 - 17:30",
          remarks: "每周五周检 -- 每月2号月检",
        },
        {
          num: 16,
          area: "欢乐时光",
          name: "能量风暴",
          time: "10:00 - 17:30",
          remarks: "每周二周检 -- 每月19号月检",
        },
        {
          num: 17,
          area: "欢乐时光",
          name: "飓风飞椅",
          time: "9:30 - 17:30",
          remarks: "每周三周检 -- 每月13号月检",
        },
        {
          num: 18,
          area: "欢乐时光",
          name: "天地双雄",
          time: "10:00 - 17:30",
          remarks: "每周一周检 -- 每月27号月检",
        },
        {
          num: 19,
          area: "欢乐时光",
          name: "魔幻风车",
          time: "10:30 - 17:30",
          remarks: "每周三周检 -- 每月13号月检",
        },
        {
          num: 20,
          area: "欢乐时光",
          name: "皇家转马",
          time: "9:30 - 17:30",
          remarks: "每周四周检 -- 每月28号月检",
        },
        {
          num: 21,
          area: "欢乐时光",
          name: "血色破晓",
          time: "10:00 - 18:00",
          remarks: "每周一周检 -- 每月2号月检",
        },
        {
          num: 22,
          area: "飓风湾",
          name: "完美风暴",
          time: "10:00 - 17:30",
          remarks: "每周四周检 -- 每月21号月检",
        },
        {
          num: 23,
          area: "飓风湾",
          name: "激流勇进",
          time: "10:30 - 17:30",
          remarks: "每周二周检 -- 每月26号月检",
        },
        {
          num: 24,
          area: "飓风湾",
          name: "魂断血域",
          time: "10:00 - 18:00",
          remarks: "每周一周检 -- 每月2号月检",
        },
        {
          num: 25,
          area: "渔光岛",
          name: "野人谷漂流",
          time: "10:30 - 17:30",
          remarks: "每周三周检 -- 每月20号月检",
        },
        {
          num: 26,
          area: "渔光岛",
          name: "东湖塔",
          time: "10:30 - 17:30",
          remarks: "每周三周检 -- 每月20号月检",
        },
        {
          num: 27,
          area: "欢乐江城",
          name: "木翼双龙",
          time: "10:30 - 17:30",
          remarks: "每周二周四周检 -- 每月14号月检",
        },
        {
          num: 28,
          area: "欢乐江城",
          name: "凤舞九天",
          time: "10:30 - 17:30",
          remarks: "每周二周四周检 -- 每月14号月检",
        },
        {
          num: 29,
          area: "羽落天堂",
          name: "丛林迷旋",
          time: "10:30 - 17:30",
          remarks: "每周三周检 -- 每月13号月检",
        },
        {
          num: 30,
          area: "羽落天堂",
          name: "魔法大草帽",
          time: "10:30 - 17:30",
          remarks: "每周一周检 -- 每月25号月检",
        },
        {
          num: 31,
          area: "羽落天堂",
          name: "DISKO",
          time: "10:30 - 17:30",
          remarks: "每周二周检 -- 每月19号月检",
        },
        {
          num: 32,
          area: "羽落天堂",
          name: "魔术自行车",
          time: "10:30 - 17:30",
          remarks: "每周五周检 -- 每月22号月检",
        },
        {
          num: 33,
          area: "羽落天堂",
          name: "浪花跳跳",
          time: "10:00 - 17:30",
          remarks: "每周四周检 -- 每月14号月检",
        },
        {
          num: 34,
          area: "极速世界",
          name: "极速飞车",
          time: "11:00 - 17:00",
          remarks: "每周三周检 -- 每月27号月检",
        },
        {
          num: 35,
          area: "极速世界",
          name: "蒙地卡罗赛道",
          time: "10:00 - 17:30",
          remarks: "每周二周检 -- 每月12号月检",
        },
        {
          num: 36,
          area: "极速世界",
          name: "太阳神车",
          time: "10:30 - 17:30",
          remarks: "每周一周检 -- 每月18号月检",
        },
        {
          num: 37,
          area: "极速世界",
          name: "霹雳战车",
          time: "9:30 - 17:30",
          remarks: "每周四周检 -- 每月28号月检",
        },
        {
          num: 38,
          area: "极速世界",
          name: "爬爬乐",
          time: "9:30 - 17:30",
          remarks: "每周三周检 -- 每月2号月检",
        },
      ],
      // 剧场类项目表格原始数据
      tableData_3: [
        {
          num: 1,
          area: "飓风湾",
          name: "4D影院",
          time: "11:00/12:00/13:00/14:00/15:00/16:00/17:00\n（共7场，17:00为最后一场）\n循环播放或视客流量定",
        },
        {
          num: 2,
          area: "甜品王国",
          name: "焦糖沙漠影院",
          time: "10:30/11:30/12:30/13:30/14:30/15:30/16:30/17:00\n（共8场，17:00为最后一场）\n循环播放或视客流量定",
        },
        {
          num: 3,
          area: "欢乐海洋",
          name: "飞越长江",
          time: "10:00-17:30\n循环播放或视客流量定",
        },
        {
          num: 4,
          area: "欢乐海洋",
          name: "极速穿越",
          time: "10:30-17:30\n循环播放或视客流量定",
        },
      ],
      // 武汉多罗碧加乐园表演时间表
      tableData_4: [
        {
          num: 1,
          program: "欢乐喷泉",
          time: "10:00/11:50/15:00/16:00",
          place: "梦想大道 - 喷泉广场",
          remarks: "-",
        },
        {
          num: 2,
          program: "超级大熊猫",
          time: "9:30",
          place: "梦想大道",
          remarks: "周一停演",
        },
        {
          num: 3,
          program: "欢乐小丑",
          time: "9:40",
          place: "梦想大道",
          remarks: "周二停演",
        },
        {
          num: 4,
          program: "小丑特大号",
          time: "10:00",
          place: "梦想大道",
          remarks: "周二停演",
        },
        {
          num: 5,
          program: "欢乐小丑",
          time: "10:20",
          place: "欢乐时光",
          remarks: "周二停演",
        },
        {
          num: 6,
          program: "泡泡世界",
          time: "10:30",
          place: "梦想大道",
          remarks: "周二停演",
        },
        {
          num: 7,
          program: "亡灵圆舞曲",
          time: "10:30-12:30/14:30-16:30",
          place: "极速世界-寻梦小镇	",
          remarks: "-",
        },
        {
          num: 8,
          program: "街头篮球",
          time: "11:00",
          place: "欢乐时光-极速世界",
          remarks: "周一停演",
        },
        {
          num: 9,
          program: "欢乐达人秀",
          time: "11:15",
          place: "飓风湾-海盗船舞台",
          remarks: "周一、二停演",
        },
        {
          num: 10,
          program: "小丑特大号",
          time: "11:15",
          place: "欢乐时光",
          remarks: "周二停演",
        },
        {
          num: 11,
          program: "※打码头",
          time: "11:30/16:00",
          place: "欢乐江城-情景剧场",
          remarks: "周一停演",
        },
        {
          num: 12,
          program: "※青春回忆录",
          time: "11:30",
          place: "梦想大道-水舞台",
          remarks: "周一、二停演",
        },
        {
          num: 13,
          program: "※幽默滑稽秀",
          time: "13:00",
          place: "欢乐时光-欢乐舞台",
          remarks: "周二停演",
        },
        {
          num: 14,
          program: "※寻梦奇缘亡灵狂欢大巡游	",
          time: "14:00",
          place: "园区主环道",
          remarks: "周一停演",
        },
        {
          num: 15,
          program: "※丧尸围城疯狂秀",
          time: "15:00/17:10",
          place: "梦想大道-水舞台",
          remarks: "周一停演",
        },
        {
          num: 16,
          program: "※逃出生天",
          time: "15:00/16:00/17:00",
          place: "水公园-畸形秀场",
          remarks: "-",
        },
        {
          num: 17,
          program: "※幽默滑稽秀",
          time: "15:00",
          place: "羽落天堂-森林剧场",
          remarks: "周二停演",
        },
        {
          num: 18,
          program: "丧尸来袭",
          time: "15:30",
          place: "飓风湾-极速世界",
          remarks: "周一停演",
        },
        {
          num: 19,
          program: "萌妹僵尸",
          time: "15:30/16:30",
          place: "飓风湾-极速世界",
          remarks: "周一停演",
        },
        {
          num: 20,
          program: "疯狂小丑",
          time: "疯狂小丑",
          place: "哈瓦那-极速世界",
          remarks: "周一停演",
        },
        {
          num: 21,
          program: "黑暗修道院",
          time: "16:00",
          place: "极速世界-哈瓦那",
          remarks: "周一停演",
        },
        {
          num: 22,
          program: "狂暴麦克斯",
          time: "16:00",
          place: "欢乐江城	",
          remarks: "周一停演",
        },
        {
          num: 23,
          program: "狂暴麦克斯",
          time: "16:00",
          place: "欢乐江城",
          remarks: "周一停演",
        },
        {
          num: 24,
          program: "恶灵高跷",
          time: "16:15",
          place: "飓风湾-欢乐时光",
          remarks: "周二停演",
        },
        {
          num: 25,
          program: "地狱医院",
          time: "16:15",
          place: "欢乐江城-欢乐时光",
          remarks: "周一停演",
        },
        {
          num: 26,
          program: "木乃伊三人行",
          time: "16:30",
          place: "欢乐时光",
          remarks: "周二停演",
        },
        {
          num: 27,
          program: "诡异修理工",
          time: "16:30",
          place: "欢乐时光-欢乐江城	",
          remarks: "周二停演",
        },
        {
          num: 28,
          program: "邪恶南瓜",
          time: "16:45",
          place: "飓风湾-欢乐时光",
          remarks: "周二停演",
        },
        {
          num: 29,
          program: "狂暴麦克斯",
          time: "17:00",
          place: "欢乐时光",
          remarks: "周一停演",
        },
        {
          num: 30,
          program: "※百鬼出笼狂欢趴",
          time: "17:30",
          place: "梦想大道-喷泉广场",
          remarks: "周一停演",
        },
        {
          num: 31,
          program: "狼人归来",
          time: "17:40",
          place: "梦想大道-喷泉广场",
          remarks: "周二停演",
        },
        {
          num: 32,
          program: "恶灵高跷",
          time: "17:40",
          place: "梦想大道-喷泉广场",
          remarks: "周二停演",
        },
        {
          num: 33,
          program: "木乃伊三人行",
          time: "17:40",
          place: "梦想大道-喷泉广场",
          remarks: "周二停演",
        },
        {
          num: 34,
          program: "诡异修理工",
          time: "17:40",
          place: "梦想大道-喷泉广场",
          remarks: "周二停演",
        },
        {
          num: 35,
          program: "邪恶南瓜",
          time: "17:40",
          place: "梦想大道-喷泉广场",
          remarks: "周二停演",
        },
      ],
    };
  },
  computed: {},
  created() {},
  mounted() {},
  methods: {
    // row 当前行, column 当前列, rowIndex 当前行号, columnIndex 当前列号
    objectSpanMethod_2({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 1) {
        if (rowIndex === 0) {
          return {
            rowspan: 5,
            colspan: 1,
          };
        } else if (rowIndex === 5) {
          return {
            rowspan: 10,
            colspan: 1,
          };
        } else if (rowIndex === 15) {
          return {
            rowspan: 6,
            colspan: 1,
          };
        } else if (rowIndex === 21) {
          return {
            rowspan: 3,
            colspan: 1,
          };
        } else if (rowIndex === 24) {
          return {
            rowspan: 2,
            colspan: 1,
          };
        } else if (rowIndex === 26) {
          return {
            rowspan: 2,
            colspan: 1,
          };
        } else if (rowIndex === 28) {
          return {
            rowspan: 5,
            colspan: 1,
          };
        } else if (rowIndex === 33) {
          return {
            rowspan: 5,
            colspan: 1,
          };
        } else {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
    objectSpanMethod_3({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 1) {
        if (rowIndex === 0) {
          return {
            rowspan: 1,
            colspan: 1,
          };
        } else if (rowIndex === 1) {
          return {
            rowspan: 1,
            colspan: 1,
          };
        } else if (rowIndex === 2) {
          return {
            rowspan: 2,
            colspan: 1,
          };
        } else {
          return {
            rowspan: 0,
            colspan: 0,
          };
        }
      }
    },
  },
};
</script>

<style scoped lang="scss">
::v-deep .el-breadcrumb {
  font-size: 21px;
  line-height: 2;
}

::v-deep .el-table .cell {
  white-space: pre-line; /*保留换行符*/
}
</style>
